import { defineConfig, presetAttributify, presetUno, presetIcons } from "unocss";

export default defineConfig({
  presets: [
    presetUno(),
    presetAttributify(), // 预设属性
    presetIcons(),
  ],
  shortcuts: [
    ["wh-full", "w-full h-full"],
    ["flex-c-c", "flex justify-center items-center"],
    ["flex-col", "flex flex-col"],
    ["text-ellipsis", "truncate"],
    [
      "icon-btn",
      "text-16 inline-block cursor-pointer select-none opacity-75 transition duration-200 ease-in-out hover:opacity-100 hover:text-primary !outline-none",
    ],
  ],
  rules: [
    [
      "card-shadow",
      {
        "box-shadow": "0 1px 2px -2px #00000029, 0 3px 6px #0000001f, 0 5px 12px 4px #00000017",
      },
    ],
    [/^bc-(.+)$/, ([, color]) => ({ "border-color": `#${color}` })],
    [/^l-h-(.+)$/, ([, d]) => ({ "line-height": `${d}` })],
    [/^u-w-(.+)$/, ([, w]) => ({ width: `${w}` })],
    [/^u-h-(.+)$/, ([, h]) => ({ height: `${h}` })],
    [/^(?:overflow|of)-(.+)$/, ([, d]) => ({ "overflow": `${d}` })],
    [/^m-(\d+)$/, ([, d]) => ({ margin: `${parseInt(d) / 4}rem` })],
    [/^p-(\d+)$/, ([, d]) => ({ padding: `${parseInt(d) / 4}rem` })],
    [/^fs(.+)$/, ([, s]) => ({ "font-size": `${s}` })],
    [/^fs(\d+)$/, ([, d]) => ({ "font-size": `${parseInt(d) / 4}rem` })],
    [
      /^rounded-t-(\d+)$/,
      ([, d]) => ({
        "border-top-left-radius": `${parseInt(d) / 4}rem`,
        "border-top-right-radius": `${parseInt(d) / 4}rem`,
      }),
    ],
    [
      /^rounded-b-(\d+)$/,
      ([, d]) => ({
        "border-bottom-left-radius": `${parseInt(d) / 4}rem`,
        "border-bottom-right-radius": `${parseInt(d) / 4}rem`,
      }),
    ],
  ],
});
